<template>
  <div style="width: 100%; padding: 10px">
    <el-card class="box-card">
      <div>
        <div style="
            display: flex;
            align-items: center;
            justify-content: space-between;
          ">
          <div class="details_Header">
            <div class="deleted_Line"></div>
            <span class="details_HeaderTitle">订单信息</span>
          </div>
          <div style="display: flex">
            <el-button type="primary" v-permission="['shipping.dispatch']"
                       v-if="form.shippingStatus == 1 && form.shippingMethod == 2" @click="confirmClick">派单
            </el-button>
            <el-button type="primary" v-permission="['shipping.audit']" v-show="
                (form.shippingStatus == 3 && form.shippingMethod == 2) ||
                (form.shippingStatus == 2 && form.shippingMethod == 2)
              " @click="completeClick">修改</el-button>
            <el-button type="primary" v-permission="['shipping.reject']"
                       v-show="form.shippingStatus == 2 && form.shippingMethod == 2" @click="disConfirmClick">驳回
            </el-button>
            <!-- 订单按钮 -->
            <el-button style="margin-left: 10px" split-button type="warn" v-permission="['shipping.print']"
                         @click="printClick" @command="handleCommand">打印
            </el-button>
          </div>
        </div>
        <div class="deleted_OrderHeader">
          <el-row :gutter="24">
            <el-col :span="8">
              <span class="deleted_Row_Headings">订单编号：</span>
              <span class="deleted_OrderTitle">{{ form.orderSn }}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">送货单号：</span>
              <span class="deleted_OrderTitle">{{ form.sn }}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">发货状态：</span>
              <span class="deleted_OrderTitle" style="color: rgb(64, 158, 255)">{{ form.statusDescr }}</span>
            </el-col>
          </el-row>
        </div>
        <div>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="8">
              <span class="deleted_Row_Headings">发货日期：</span>
              <span class="deleted_OrderTitle">{{ form.orderDate | dateFormatter }}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">发货仓库：</span>
              <span class="deleted_OrderTitle">{{ shopName }}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">所属部门：</span>
              <span class="deleted_OrderTitle">{{ officeName }}</span>
            </el-col>
          </el-row>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="8">
              <span class="deleted_Row_Headings">开票类型：</span>
              <span class="deleted_OrderTitle">{{ form.taxType | watchTaxType }}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">配送方式：</span>
              <span class="deleted_OrderTitle">{{form.shippingMethod | watchShippingMethod}}</span>
            </el-col>
            <el-col :span="8">
              <span class="deleted_Row_Headings">送货人员：</span>
              <span class="deleted_OrderTitle">{{ adminName }}</span>
            </el-col>
          </el-row>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="8">
              <span class="deleted_Row_Headings">买家留言：</span>
              <span class="deleted_OrderTitle">{{ form.memo }}</span>
            </el-col>
          </el-row>
        </div>
        <div class="details_PayHeader">
          <div class="deleted_Line"></div>
          <span class="details_HeaderTitle">买家信息</span>
        </div>
        <div>
          <div class="details_Buyers" style="margin-top:20px;width:800px">
            <span class="deleted_Row_Headings">客户名称：</span>
            <span class="deleted_OrderName" style="width:100px">{{ memberName }}</span>
            <span class="deleted_Row_Headings">客户编号：</span>
            <span class="deleted_OrderName">{{ (form.memberCode) }}</span>
          </div>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="24">
              <div class="details_Buyers">
                <span class="deleted_Row_Headings">收货信息：</span>
                <div>
                  <span class="deleted_OrderName">{{ form.consignee }} {{ form.phone }}</span>
                  <span class="deleted_OrderName" style="margin-top: 5px; width: 600px">{{ form.address }}</span>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
        <div class="product_header_name" style="">
          <span style="font-size: 18px; color: #409eff; margin: 10px 10px">商品明细</span>
        </div>
        <!--商品规格-->
        <el-table :data="form.itemList" border show-summary stripe style="width: 100%">
          <el-table-column label="排序" type="index" width="50" fixed>
          </el-table-column>
          <el-table-column label="商品图片" width="80" align="center">
            <template slot-scope="{ row }">
              <el-avatar shape="square" :size="50" fit="fit" :src="row.thumbnail"></el-avatar>
            </template>
          </el-table-column>
          <el-table-column label="商品名">
            <template slot-scope="{ row }">
              <span>{{ row.name }}</span>
            </template>
          </el-table-column>
          <el-table-column label="规格" align="center">
            <template slot-scope="{ row }">
              <span>{{ row.spec }}</span>
            </template>
          </el-table-column>
          <el-table-column label="货号/条码" width="170">
            <template slot-scope="{ row }">
              <span>{{ row.sn }}</span>
            </template>
          </el-table-column>
          <el-table-column label="单位" width="70" align="center">
            <template slot-scope="{ row }">
              <span>{{ row.unit }}</span>
            </template>
          </el-table-column>
          <el-table-column label="送货数量" prop="quantity" align="right" width="80">
          </el-table-column>
          <el-table-column label="回桶数量" v-if="form.shippingMethod == 2 && subType == 4" align="right" width="80"
                           prop="emptyBarrelQuantity">
          </el-table-column>
          <el-table-column label="单价" align="right" width="100">
            <template slot-scope="{ row }">
              <span>{{ row.price }}</span>
            </template>
          </el-table-column>
          <el-table-column label="金额" width="100" align="right" prop="amount">
          </el-table-column>
          <el-table-column label="优惠" width="100" align="right" prop="discount">
          </el-table-column>
          <el-table-column label="物流单号" width="150" align="right" v-if="form.shippingMethod == 1">
            <template slot-scope="{ row }">
              <span>{{ row.trackingNo }}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" fixed="right" align="center" width="80">
            <template slot-scope="scope">
              <el-link type="primary" @click="logisticDetail(scope.row.trackingNo)">
                {{ scope.row.trackingNo ? "查看物流" : "" }}
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <div class="product_header_nameTwo">
          <div class="deleted_Line"/>
          <span style="margin: 10px 5px;">付款方式</span>
        </div>
        <div v-for="item in payments">
          <div class="deleted_OrderHeader">
            <el-row :gutter="24">
              <el-col :span="1">
                <span style="padding-left: 20px;">├</span>
              </el-col>
              <el-col :span="4">
                <span>{{ item.createDate | datetimeFormatter }}</span>
              </el-col>
              <el-col :span="4">
                <span>付款方式 :</span>
                <span>{{ item.paymentPluginName }}</span>
                <span style="margin-left:10px" class="submit_payMethod_Content_DateTwo"
                      v-if="item.attach.quantity !=undefined && (item.paymentPluginId == 'waterTicketPayPlugin' || item.paymentPluginId == 'couponCodePayPlugin')">(抵扣{{ item.attach.quantity }}张)</span>
              </el-col>
              <el-col :span="3">
                <span>付款金额 :</span>
                <span>{{ item.amount }}</span>
              </el-col>
              <el-col :span="3">
                <span style="color: rgb(64, 158, 255)">{{ item.status | watchPayment }}</span>
              </el-col>
              <el-col :span="9">
                <span>备注 : </span>
                <span>{{ item.memo }}</span>
              </el-col>
            </el-row>
          </div>
        </div>

        <div class="product_header_nameTwo">
          <div class="deleted_Line"/>
          <span style="margin: 10px 5px;">订单日志</span>
        </div>
        <div v-for="item in orderLog">
          <div class="deleted_OrderHeader">
            <el-row :gutter="20">
              <el-col :span="1">
                <span style="padding-left: 20px;">├</span>
              </el-col>
              <el-col :span="4">
                <span>{{ item.createDate | datetimeFormatter }}</span>
              </el-col>
              <el-col :span="19">
                <span>{{ item.content }}</span>
              </el-col>
            </el-row>
          </div>
        </div>
      </div>
    </el-card>
    <el-dialog title="派单" :visible.sync="confirmType" width="40%" v-el-drag-dialog append-to-body
               :before-close="confirmClose">
      <div style="position: relative">
        <el-form ref="form" :label-position="labelPosition" :model="form" label-width="90px">
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="24">
              <el-form-item label="收货信息：">
                <span>{{ form.consignee }}{{ form.phone }}</span>
                <div>{{ form.address }}{{ form.areaName }}</div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="12">
              <el-form-item label="发货仓库">
                <el-select v-model="shopName" :filter-method="remoteMethodshop" value-key="id" clearable filterable placeholder="请选择"
                           @change="selectShop" @clear="clearShopClick">
                  <el-option style="width:600px" v-for="item in supplierList" :key="item.id" :label="item.name"
                             :value="item">
                    <div style="display: flex">
                      <span style="float: left;width: 150px;overflow: hidden;text-overflow: ellipsis;">{{ item.name }}</span>
                      <span style="width:100px;">{{ item.distance != null ? item.distance + "KM" : '无' }}</span>
                      <div style="width: 200px;">
                        <span style="color: #8492a6; font-size: 8px;">{{ item.address }}</span>
                      </div>
                    </div>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="送货员" v-if="unionType!=4">
                <el-select v-model="value1" :filter-method="remoteMethod" filterable placeholder="请选择">
                  <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-table :data="form.itemList" border style="width: 100%;margin-top:10px">
            <el-table-column type="index" width="50" align="center">
            </el-table-column>
            <el-table-column prop="name" label="商品名" min-width="180">
            </el-table-column>
            <el-table-column prop="spec" label="规格" width="120">
            </el-table-column>
            <el-table-column prop="quantity" label="订单数量">
            </el-table-column>
          </el-table>
        </el-form>
        <div style="
            display: flex;
            justify-content:space-between;
            align-items: center;
            margin-top: 30px;
          ">
          <el-input v-model="memberMemo" placeholder="请输入配送留言" style="width:500px"></el-input>
          <el-button type="primary" :loading="memberclicked" @click="memberSave">派单</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="发货" :visible.sync="shippingType" width="900px" v-el-drag-dialog append-to-body
               :before-close="shippingClose">
      <div style="position: relative">
        <el-form ref="form" :label-position="labelPosition" :model="form" label-width="90px">
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="12">
              <el-form-item label="收货人：">
                <span>{{ form.consignee }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系电话：">
                <span>{{ form.phone }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="24">
              <el-form-item label="收货信息：">
                <span>{{ form.address }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-table :data="form.itemList" border style="width: 100%">
            <el-table-column type="index" width="50" align="center" fixed>
            </el-table-column>
            <el-table-column prop="name" label="商品名" min-width="180">
            </el-table-column>
            <el-table-column prop="spec" label="规格" width="120">
            </el-table-column>
            <el-table-column prop="quantity" label="订单数量">
            </el-table-column>
            <el-table-column width="200" prop="shippedQuantity" label="物流单号">
              <template slot-scope="{ row }">
                <el-input v-model="row.trackingNo"/>
              </template>
            </el-table-column>
          </el-table>
        </el-form>
        <div style="
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-top: 30px;
          ">
          <el-button type="primary" :loading="shippingclicked" @click="shippingSave">发货</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="修改物流单号" :visible.sync="logisticsType" width="900px" v-el-drag-dialog append-to-body
               :before-close="logisticsClose">
      <div style="position: relative">
        <el-form ref="form" :label-position="labelPosition" :model="form" label-width="90px">
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="12">
              <el-form-item label="收货人：">
                <span>{{ form.consignee }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系电话：">
                <span>{{ form.phone }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="24">
              <el-form-item label="收货信息：">
                <span>{{ form.address }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-table :data="form.itemList" border style="width: 100%">
            <el-table-column type="index" width="50" align="center" fixed>
            </el-table-column>
            <el-table-column prop="name" label="商品名" min-width="180">
            </el-table-column>
            <el-table-column prop="spec" label="规格" width="120">
            </el-table-column>
            <el-table-column prop="quantity" label="订单数量">
            </el-table-column>
            <el-table-column width="200" prop="shippedQuantity" label="物流单号">
              <template slot-scope="{ row }">
                <el-input v-model="row.trackingNo"/>
              </template>
            </el-table-column>
          </el-table>
        </el-form>
        <div style="
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-top: 30px;
          ">
          <el-button type="primary" :loading="logisticsclicked" @click="logisticsSave">修改</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog :title="bomTile" width="650px" :visible.sync="returnVisible">
      <div class="el-dialog-div">
        <el-form ref="emptyBarrelRef" label-width="80px">
          <el-form-item label="商品名称" style="margin-bottom: 20px">
            <el-select value-key="id" v-model="productTongName" placeholder="请选择" :filter-method="filterProduct"
                       filterable @change="productTongNamechang" style="width: 205px">
              <el-option v-for="item in TongProduct" :key="item.id" :label="item.name" :value="item">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="押金名称" style="margin-bottom: 20px">
            <el-select value-key="id" v-model="productName" placeholder="请选择" @change="productIdchang" style="width: 205px">
              <el-option v-for="item in products" :key="item.id" :label="item.name" :value="item">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="bomTileagein">
            <el-input v-model="obbitem.quality" style="width: 205px" type="Number" clearable/>
          </el-form-item>
        </el-form>
        <div style="
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-top: 20px;
          ">
          <el-button type="primary" size="mini" @click="selectBom">{{bomTile}}</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="物流信息" width="60%" :visible.sync="logisticsVisible">
      <div class="el-dialog-div">
        <el-table :data="logisticsData" border>
          <el-table-column label="物流单号" width="140">
            <template slot-scope="scope">{{ scope.row.trackingNo }}</template>
          </el-table-column>
          <el-table-column label="商品图片" width="80">
            <template slot-scope="scope">
              <img :src="scope.row.thumbnail" style="width: 100%; height: 100%"/>
            </template>
          </el-table-column>
          <el-table-column label="商品名称">
            <template slot-scope="scope">
              <el-tooltip class="item" effect="dark" :content="scope.row.name" placement="top">
                <span>{{ scope.row.name }}</span>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column label="商品规格">
            <template slot-scope="scope">
              <el-tooltip class="item" effect="dark" :content="scope.row.spec" placement="top">
                <span>{{ scope.row.spec }}</span>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column label="操作" fixed="right" align="center" width="80">
            <template slot-scope="scope">
              <el-link type="primary" @click="logisticDetail(scope.row.trackingNo)">
                {{ scope.row.trackingNo ? "查看物流" : "" }}
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>
    <el-dialog title="打印安装教程" :visible.sync="isNoInstall" width="600px" v-el-drag-dialog append-to-body
               :before-close="installClose">
      <div style="position: relative; height: 30vh; overflow: auto">
        <div>
          <span style="font-weight: bold">未检测到您的打印控件，请检查是否安装以下两个打印控件</span>
          <span
            style="display: block; margin-left: 20px; line-height: 20px">1、install_lodop64.exe（或者32位，根据自己的电脑位数）</span>
          <span
            style="display: block; margin-left: 20px; line-height: 20px">2、CLodopPrint_Setup_for_Win32NT.exe（32位64位皆可用）</span>
          <span style="display: block; margin-left: 20px; line-height: 20px">3、苹果系统暂时无法支持</span>
          <span style="font-weight: bold">已经下载</span>
          <span style="display: block; margin-left: 20px; line-height: 20px">如果已有两个软件，请检查是否已经打开服务。</span>
          <span style="font-weight: bold">未下载</span>
          <spanfond style="display: block; margin-left: 20px; line-height: 20px">如果没有两个控件的客户，您可以点击下面的下载地址自行前往下载<a
            style="color: #00b6fb; margin-left: 20px" target="view_window"
            href="http://www.c-lodop.com/download.html">下载地址</a></spanfond>
          <span
            style="display: block; margin-left: 20px; line-height: 20px">(提示：请下载Lodop发型包Windows版，里面包含所需的两个控件，安装完后请刷新本页面方可使用打印，install_lodop64.exe软件下载完打开即可，
            CLodopPrint_Setup_for_Win32NT.exe需要安装，您可以直接选择开机自动启动)</span>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="快递动态" width="60%" :visible.sync="logisticsDetailVisible">
      <div class="el-dialog-div">
        <el-table :data="logisticsDetailData">
          <el-table-column prop="ftime" label="时间" width="170"></el-table-column>
          <el-table-column label="快递动态">
            <template slot-scope="scope">
              <span :style="{ color: scope.$index === 0 ? '#409EFF' : '' }">{{ scope.row.context }}</span>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>
<!--    送达-->
    <el-dialog title="修改" :visible.sync="writeoffType" width="900px" v-el-drag-dialog append-to-body
               :before-close="writeoffClose">
      <div style="position: relative">
        <el-form ref="form" :label-position="labelPosition" :model="form" label-width="90px">
          <el-row :gutter="24" class="deleted_OrderContent">
            <el-col :span="16">
              <el-form-item label="收货人：">
                <span>{{ form.consignee }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="配送站点：">
                <span>{{ shopName }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="16">
              <el-form-item label="联系电话：">
                <span>{{ form.phone }}</span>
              </el-form-item>
              <el-form-item label="收货地址：">
                <span>{{ form.address }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="配送人员：">
                <span>{{ shippingEmployeeName }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-table :data="form.itemList" border :height="allHeight" style="width: 100%; margin-top: 10px">
            <el-table-column type="index" width="50" align="center" fixed>
            </el-table-column>
            <el-table-column prop="name" label="商品名" min-width="180">
            </el-table-column>
            <el-table-column prop="spec" label="规格" width="120">
            </el-table-column>
            <el-table-column prop="quantity" align="center" label="数量" width="50"> </el-table-column>

            <el-table-column prop="price" align="center" label="单价" width="50"> </el-table-column>
            <el-table-column width="80" v-if="subType == 4" prop="returnQuantity" label="退货数量">
              <template slot-scope="row">

                <el-input v-model="row.row.returnQuantity" @blur="ifblur(row.$index)" @focus="iffocus(row.$index)"
                          type="number" :disabled="row.row.subType!=4" />
              </template>
            </el-table-column>
            <el-table-column width="80" v-if="subType == 4" prop="emptyBarrelQuantity" label="回桶数量">
              <template slot-scope="{ row }">
                <el-input v-model="row.emptyBarrelQuantity" type="number" :disabled="row.subType!=4" />
              </template>
            </el-table-column>

            <el-table-column label="操作" align="center" width="80">
              <template slot-scope="scope">
                <div v-if="((scope.row.subType==4&&scope.row.quantity==0)||scope.row.subType==3)">
                  <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
                    <a style="margin-left: 10px" @click="deleteAd(scope.row)">
                      <i style="color: #f56c6c" class="el-icon-delete"></i>
                    </a>
                  </el-tooltip>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div class="deleted_OrderHeader" style="
              display: flex;
              justify-content: space-around;
              align-items: center;
            ">

            <div class="centralinformation">
              <div>
                <span class="deleted_Row_Headings">运费：</span>
                <el-input v-model="shippingFreight" placeholder="请输入内容" style="width:80px" @blur=freightchange>
                </el-input>
              </div>
              <div>
                <span class="deleted_Row_Headings">楼层费：</span>
                <el-input v-model="levelFreight" placeholder="请输入内容" style="width:80px"></el-input>
              </div>
              <div style="margin-left:10px;display: flex; justify-content: center; align-items: center;">
                <span class="deleted_Row_Headings">优惠：</span>
                <span class="deleted_OrderTitle">{{ discount }}</span>
              </div>
            </div>
            <div style="margin-left: 30px">
              <el-button type="info" @click="depositClick" v-if="subType == 4">添加押桶</el-button>
              <el-button type="info" @click="returnClick" v-if="subType == 4">添加退桶</el-button>
              <el-button type="info" @click="returnbackClick" v-if="subType == 4">添加回桶</el-button>
            </div>
          </div>
          <div style="display: flex">
            <div class="product_header">
              <div class="deleted_Line" />
              <span style="margin: 5px 5px">付款方式</span>
            </div>
            <div class="product_header" style="
                width: 40%;
                display: flex;
                justify-content: space-between;
                padding-right: 10px;
              ">
              <div style="
                  display: flex;
                  justify-content: center;
                  align-items: center;
                ">
                <div class="deleted_Line" />
                <span style="margin: 5px 5px">支付方式</span>
              </div>
              <div>
                <span style="color: red">本单待收款:{{ allWaitPay | price}}</span>
              </div>
            </div>
          </div>
          <div style="display: flex; justify-content: space-between">
            <div style="
                display: flex;
                flex-direction: column;
                justify-content: inherit;
              ">
              <div class="deleted_OrderHeader_payment" v-for="item in payments" v-if="item.status == 1">
                <span style="margin-right: 15px">{{
                    item.createDate | datetimeFormatter
                  }}</span>
                <span>付款方式 :</span>
                <span>{{ item.paymentPluginName }}</span>
                <span style="margin-left: 10px" class="submit_payMethod_Content_Date" v-if="
                    item.attach.quantity != null &&
                    (item.paymentPluginId == 'waterTicketPayPlugin' ||
                      item.paymentPluginId == 'couponCodePayPlugin')
                  ">(抵扣{{ item.attach.quantity }}张)</span>

                <span style="margin-left: 15px">付款金额 :</span>
                <span>{{ item.amount }}</span>
              </div>
              <div>
                <span>历史欠款：{{ historyAmount }}</span>
                <span style="margin-left: 10px" v-if="historyQuantity > 0">历史欠票：{{ historyQuantity }}</span>
              </div>
            </div>

            <div style="
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                padding-left: 20px;
              ">
              <div class="select_payment">
                <div style="display: flex; align-items: center; margin-bottom: 5px">
                  <span style="margin-right: 10px">实收现金</span>
                  <el-input v-model="pay[0].amount" @blur="toCalculation" style="width: 220px" />
                </div>
                <div style="display: flex" v-if="isWaterShow == true">
                  <div style="
                      display: flex;
                      align-items: center;
                      margin-bottom: 5px;
                    ">
                    <span style="margin-right: 10px">水票金额</span>
                    <el-input v-model="pay[1].amount" @blur="toCalculation" style="width: 91px; margin-right: 5px" />
                  </div>
                  <div style="
                      display: flex;
                      align-items: center;
                      margin-bottom: 5px;
                    ">
                    <span style="margin-right: 5px">水票张数</span>
                    <el-input v-model="pay[1].quantity" style="width: 64px" />
                  </div>
                </div>
                <div style="display: flex; align-items: center">
                  <span style="margin-right: 10px">欠款金额</span>
                  <el-input v-model="pay[2].amount" @blur="toCalculation" style="width: 220px" />
                </div>
              </div>
            </div>
          </div>
        </el-form>
        <div style="
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-top: 30px;
          ">
          <div>
            <el-button type="primary" :loading="writeoffclicked" @click="writeoffSave">修改</el-button>
          </div>
        </div>
      </div>
    </el-dialog>
    <el-dialog :title="bomTile" width="650px" :visible.sync="returnbackVisible">
      <div class="el-dialog-div">
        <el-form ref="emptyBarrelRef" label-width="120px">
          <el-form-item label="商品名称" style="margin-bottom: 20px;">
            <el-select value-key="id" v-model="productTongName" placeholder="请选择" :filter-method="filterProduct"
                       filterable @change="productTongNamechang" style="width: 205px">
              <el-option v-for="item in TongProduct" :key="item.id" :label="item.name" :value="item">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="回桶库存量">
            <el-input v-model="obbitem.returnemptyBarrelQuantity" style="width: 205px" type="Number" clearable />
          </el-form-item>
        </el-form>

        <div style="
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-top: 20px;
          ">
          <el-button type="primary" size="mini" @click="selectreturnBom">添加回桶</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import permission from "@/directive/permission/index.js"; // 权限判断指令
import {
  EventBus
} from "@/api/eventBus";
import {
  updateTrackingNo,
  find,
  complete,
  disComplete,
  received,
  reject,
  shipping,
  confirm,
  batchShipping,
  cancel,
  trackingNo_query,
  delivery_query,
  dispatch,
  print
} from "@/api/shipping";
import utils from "../../utils/utils.js";
import {
  list
} from "@/api/product";
import {
  decVirtaul,
  addVirtaul,
  removeVirtaul
} from "@/api/virtualProduct";
import {
  update as updatePayment,
  save
} from "@/api/payment";
import elDragDialog from "@/directive/el-drag-dialog"; // base on element-ui
// import Distpicker from '@/components/Distpicker/Distpicker'
import {lbsList,find as shopFind} from '@/api/shop'
import {
  list as employee
} from "@/api/sysEmployee";
import printJs from "print-js";
import {
  mapGetters
} from "vuex";
import {
  getMenuTree
} from "@/api/sysMch";
import {
  addShippingItem,
  delShippingItem
} from "@/api/shipping";
import {
  find as orderFind,confirm as orderConfirm,cancel as orderCancel
} from '@/api/order'
import {
  confirm as askforConfirm,
  received as askforReceived,
  cancel as askforCancel,
  refunds as askforRefunds
} from '../../api/askfor'
export default {
  naem: "shipping-view",
  directives: {
    elDragDialog,
    permission
  },
  data() {
    return {
      shoplat:0,
      shoplng:0,
      bomTileagein: null,
      memberMemo: null, //客户留言
      levelFreight: 0, //楼层费
      shippingFreight: 0, //运费
      returnbackVisible: false, //回桶
      keyword: {
        name: "",
      },
      productName: "", //押金名称
      productTongName: "", //商品名
      TongProduct: "", //  商品列表
      obbitem: {
        productId: "",
        quality: "",
        emptyBarrelId: "",
        returnemptyBarrelQuantity: "", //库存量
      },
      form: {
        id: "",
      },
      isPrintShow: false,
      sendForm: "",
      payments: [],
      title: "送货",
      signName: "客户",
      freight: 0,

      discount: 0,
      bomTile: "添加退桶",
      products: [],
      memoName: "买家",
      virtualProducts: [],
      returnVisible: false,
      updatePaymentClicked: false,
      shippingclicked: false,
      isNoInstall: false,
      writeoffType: false,
      subType: "",
      isShipping: false,
      outNum: 0,
      historyAmount: 0,
      historyQuantity: 0,
      inNum: 0,
      backNumber: 0,
      cashPay: "",
      waterPay: "",
      waterStock: 0,
      arrearsPay: "",
      shippingEmployeeName: "",
      logisticsType: false,
      logisticsclicked: false,
      serviceType: false,
      pageNum: 1,
      bomType: "",
      pageSize: 20,
      amount: 0,
      allWaitPay: 0,
      logisticsData: [], //物流信息
      logisticsDetailData: [], //物流详情
      logisticsVisible: false,
      logisticsDetailVisible: false,
      adminName: "",
      shopName: "",
      pay: [{
        amount: 0,
        paymentPluginId: "cashPayPlugin",
        paymentPluginName: "实收现金",
        status: 0,
        quantity: 0,
        method: 1,
        attach: "",
        id: "",
      },
        {
          amount: 0,
          paymentPluginId: "paperPayPlugin",
          paymentPluginName: "纸质水票",
          status: 0,
          method: 1,
          quantity: 0,
          attach: "",
          id: "",
        },
        {
          amount: 0,
          paymentPluginId: "debtPayPlugin",
          paymentPluginName: "月结欠款",
          status: 0,
          method: 1,
          quantity: 0,
          attach: "",
          id: "",
        },
      ],
      ShippingExportVo: [],
      allHeight: null,
      isWaterShow: false,
      allCount: 0,
      memberName: "",
      officeName: "",
      operatorName: "",
      shippingStatus: 0,
      orderStatus:0,
      paymentStatus:0,
      serviceclicked: false,
      memberclicked: false,
      writeoffclicked: false,
      confirmType: false,
      shippingType: false,
      trackingNo: "",
      value: "",
      supplierList: [],
      memberList: [],
      value1: "",
      labelPosition: "left",
      shippingMethod: 0,
      returnQuantityshow: true,
      iffocusnumber: 0,
      orderLog: [],
      orderId:'',
      askfor:null,
      unionType:0,
    };
  },
  computed: {
    ...mapGetters(["token", "scopeType"]),
  },
  watch:{
    shopName (newName,oldName){
      console.log(newName)
      console.log('我监听到了')
      this.unionClick()
    }
  },
  filters: {
    watchStatus(val) {
      if (val == 0) {
        return "未确认";
      } else if (val == 1) {
        return "已派单";
      } else if (val == 2) {
        return "已发货";
      } else if (val == 3) {
        return "已送达";
      } else if (val == 4) {
        return "已完成";
      } else if (val == 5) {
        return "已关闭";
      }
    },
    watchPayment(val) {
      if (val == 0) {
        return "等待支付";
      } else if (val == 1) {
        return "支付成功";
      } else if (val == 2) {
        return "超时关闭";
      } else if (val == 3) {
        return "付款失败";
      }
    },
    watchTaxType(val) {
      if (val == 0) {
        return "不开票";
      } else if (val == 1) {
        return "增票";
      } else if (val == 2) {
        return "普票";
      }
    },
    watchShippingMethod(val) {
      if (val == 0) {
        return "普通快递";
      } else if (val == 1) {
        return "到店提货";
      } else if (val == 2) {
        return "同城快送";
      }
    },
    price(value) {
      var toFixedNum = Number(value).toFixed(3);
      var realVal = toFixedNum.substring(0, toFixedNum.toString().length - 1);
      return realVal;
    },
    number(value) {
      var toFixedNum = Number(value).toFixed(0);
      return toFixedNum;
    }
  },
  created() {
    var _this = this;
    _this.form.id = this.$route.query.id;
    this.loadMenus();
    _this.findClick();
  },
  methods: {

    calculateWaitPay() {
      var waitReturn = 0;
      this.form.itemList.forEach(function (item, index) {
        if (utils.isNull(item.returnQuantity)) {
          item.returnQuantity = 0
        }
        if (item.returnQuantity < 0) {
          item.returnQuantity = 0
        }
        var itemDiscount = (Number(item.discount) / Number(item.quantity)) * Number(item.returnQuantity);
        var itemAmount = Number(item.price) * Number(item.returnQuantity);
        if (item.discount > 0) {
          waitReturn = Number(waitReturn) - Number(itemDiscount) + Number(itemAmount)
        } else {
          waitReturn = Number(waitReturn) + Number(itemAmount)

        }
      })

      var calculation = 0;

      this.pay.forEach((item) => {
        if (item.status == 1) {
          calculation += item.amount;
        }
      });


      this.allWaitPay = this.amount - calculation - waitReturn - Number(this.freight) + Number(this.shippingFreight);

    },
    filterProduct(data) {
      console.log(data);
      this.keyword.name = data;
      this.loadTongProduct();
    },
    productIdchang(val) {
      console.log(val);
      this.barrelsNumber = val;
      this.obbitem.productId = val.id;
      this.productName = val.name;
    },
    productTongNamechang(val) {
      console.log(val);
      this.obbitem.emptyBarrelId = val.id;
    },
    loadTongProduct() {
      list({
        subType: 4,
        name: this.keyword.name,
      }).then((res) => {
        this.TongProduct = res.data.data;
      });
    },

    loadMenus() {
      this.isWaterShow = this.scopeType == 3


    },
    loadProduct() {
      list({
        subType: 3,
        type: 1,
      }).then((res) => {
        this.products = res.data.data;
      });
    },
    installClose() {
      this.isNoInstall = false;
    },
    selectBom() {
      var allQuality = 0;
      allQuality += Number(this.obbitem.quality);
      if (allQuality != "" || allQuality != 0) {
        if (this.bomType == "return") {
          this.$confirm("确认退桶?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            decVirtaul({
              productId: this.obbitem.productId,
              quantity: this.obbitem.quality,
              shippingId: this.form.id,
              emptyBarrelId: this.obbitem.emptyBarrelId,
            }).then((res) => {
              this.returnVisible = false;
              this.findClick();
            });
          });
        } else if (this.bomType == "add") {
          this.$confirm("确认押桶?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            addVirtaul({
              productId: this.obbitem.productId,
              quantity: this.obbitem.quality,
              shippingId: this.form.id,
              emptyBarrelId: this.obbitem.emptyBarrelId,
            }).then((res) => {
              this.returnVisible = false;
              this.findClick();
            });
          });
        }
      } else {
        this.$message({
          message: "请输入桶数量",
          type: "warning",
        });
      }
      // })
    },

    cancelClick() {
      this.$confirm("确认关闭订单?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        cancel(this.form.id)
          .then((res) => {
            this.$message({
              message: res.content,
              offset: 120,
              center: true,
            });
            this.findClick();
            EventBus.$emit("shipping-view", res.data);
          })
          .catch((error) => {
          });
      });
    },
    findClick() {
      var _this = this;
      this.cashPay = 0;
      this.waterPay = 0;
      this.arrearsPay = 0;
      this.payRefresh();
      find(this.form.id)
        .then((response) => {
          this.orderId = response.data.shipping.orderId
          if (response.data.order != null && response.data.order != undefined) {
            _this.orderStatus = response.data.order.orderStatus
            _this.shippingStatus = response.data.order.shippingStatus
            _this.paymentStatus = response.data.order.paymentStatus
            _this.shoplng = response.data.order.lng
            _this.shoplat = response.data.order.lat
          }
          if (response.data.askfor != null && response.data.askfor != undefined) {
            _this.askfor = response.data.askfor
          }
          this.sendForm = response.data;
          response.data.shipping.itemList.forEach(function (item) {
            if (item.subType == 4) {
              _this.subType = 4
            }
          })
          console.log(_this.subType)
          console.log('水版本')
          this.freight = response.data.freight;
          this.shippingFreight = this.freight
          this.discount = response.data.discount;
          this.amount = Number(response.data.amount).toFixed(2);
          this.allWaitPay = response.data.amount;
          this.historyAmount = response.data.receivableAmount;
          this.historyQuantity = response.data.receivableQuantity;
          this.adminName = response.data.shippingEmployeeName;
          this.shopName = response.data.shopName;
          this.shippingEmployeeName = response.data.shippingEmployeeName;
          this.memberMemo = response.data.memberMemo
          this.orderLog = response.data.orderLog
          _this.form = response.data.shipping;
          this.levelFreight = this.form.levelFreight
          this.virtualProducts = response.data.virtualProductList;
          _this.form.itemList.forEach((item) => {
            if (item.returnQuantity == null) {
              item.returnQuantity = 0;
            }
          });
          if (_this.form.itemList.length > 3) {
            this.allHeight = 250 + "px";
          } else {
            this.allHeight = 235 + "px";
          }
          response.data.payments.forEach((item) => {
            if (item.attach != '') {
              item.attach = JSON.parse(item.attach)
            }
            if (item.paymentPluginId == "cashPayPlugin" && item.status == 0) {
              this.pay[0].amount += item.amount;
              this.pay[0].id = item.id;
            } else if (
              item.paymentPluginId == "paperPayPlugin" &&
              item.status == 0
            ) {
              this.pay[1].amount += item.amount;
              this.pay[1].id = item.id;
              this.pay[1].quantity += item.quantity;
            } else if (
              item.paymentPluginId == "debtPayPlugin" &&
              item.status == 0
            ) {
              this.pay[2].amount += item.amount;
              this.pay[2].id = item.id;
            }
          });
          if (
            !utils.isNull(response.data.emptyBarrelList) &&
            response.data.emptyBarrelList.length > 0
          ) {
            response.data.emptyBarrelList.forEach((item) => {
              if (item.emptyType == 1) {
                this.outNum = item.quantity;
              } else {
                this.initialN = item.quantity;
              }
            });
          }
          _this.payments = response.data.payments
          // _this.shippingStatus = response.data.shippingStatus;
          _this.memberName = response.data.memberName;
          // _this.operatorName = response.data.operatorName;
          _this.officeName = response.data.officeName;
          _this.shippingMethod = response.data.shippingMethod;

          if (this.subType == 4) {
            this.virtualProducts.forEach((item) => {
              if (item.shippingId != null) {
                this.form.itemList.push(item);
              }
            });
          }

          this.calculateWaitPay();
        })
        .catch((error) => {
        });
    },

    remoteMethod(query) {
      console.log(query);
      this.loadMember(query);
    },
    disCompleteClick() {
      disComplete(this.form.id)
        .then((response) => {
          this.$message({
            message: response.content,
            offset: 120,
            center: true,
          });
          this.findClick();
        })
        .catch((error) => {
        });
    },
    logisticsClose() {
      this.logisticsType = false;
    },

    serviceSave() {
      var _this = this;
      _this.serviceclicked = true;
      let params = new URLSearchParams();
      params.append("shippingFreight", this.shippingFreight);
      params.append("levelFreight", this.levelFreight);
      shipping(this.form.id, this.form.itemList, params)
        .then((response) => {
          if (response.type == "success") {
            _this.findClick();
            _this.serviceclicked = false;
            EventBus.$emit("shipping-view", response.data);
          }
        })
        .catch((error) => {
          _this.serviceclicked = false;
        });
    },
    disConfirmClick() {
      this.$confirm("确认驳回订单?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        reject(this.form.id)
          .then((response) => {
            this.$message({
              message: response.content,
              offset: 120,
              center: true,
            });
            this.findClick();
          })
          .catch((error) => {
          });
      });
    },
    shippingClose() {
      this.shippingType = false;
    },
    logisticsClick() {
      // 查看物流
      let params = new URLSearchParams();
      params.append("pageNum", this.pageNum);
      params.append("pageSize", this.pageSize);
      params.append("orderId", this.form.orderId);
      trackingNo_query(params)
        .then((res) => {
          console.log(res);
          this.logisticsData = res.data.data;
          this.logisticsVisible = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    logisticDetail(trackingNo) {
      this.logisticsDetailData = [];
      delivery_query({
        trackingNo
      })
        .then((res) => {
          console.log(res);
          this.logisticsDetailData = res.data.data;
          this.logisticsVisible = false;
          this.logisticsDetailVisible = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    logisticsSave() {
      var _this = this;
      this.logisticsclicked = true;
      updateTrackingNo(this.form.id, this.form.itemList)
        .then((response) => {
          if (response.type == "success") {
            _this.logisticsclicked = false;
            _this.logisticsType = false;
            _this.findClick();
            EventBus.$emit("shipping-view", response.data);
          }
          // this.$message({
          //   message: response.content,
          //   offset: 120,
          //   center: true
          // });
          // _this.shippingType = false
        })
        .catch((error) => {
          _this.logisticsclicked = false;
        });
    },
    shippingSave() {
      this.shippingclicked = true;
      var _this = this;
      shipping(this.form.id, this.form.itemList)
        .then((response) => {
          console.log(response);
          if (response.type == "success") {
            this.shippingclicked = false;
            _this.shippingType = false;
            _this.findClick();
            EventBus.$emit("shipping-view", response.data);
          }
        })
        .catch((error) => {
          this.shippingclicked = false;
        });
    },
    confirmClick() {
      this.confirmType = true;
      // if (this.form.shopId) {
      //   this.value = this.form.shopId;
      // }

      this.loadSupplier("");
      this.loadMember("");
    },
    confirmClose() {
      this.confirmType = false;
    },
    remoteMethodshop(data) {
      this.loadSupplier(data)
    },
    selectShop(data) {
      console.log(data)
      this.shopName = data.name
      this.form.shopId = data.id
      this.remoteMethodshop(data)
    },
    clearShopClick(){
      this.shopName = ''
      this.form.shopId = ''
    },
    loadSupplier(query) {
      let params = new URLSearchParams();
      params.append('keyword', query)
      params.append('lat', this.shoplat)
      params.append('lng', this.shoplng)
      lbsList(params)
        .then((response) => {
          console.log(response);
          this.supplierList = response.data;
          this.supplierList.forEach(item => {
            item.distance = item.distance.toFixed(2)
          })
        })
        .catch((error) => {
          console.log("error!!");
        });
    },
    loadMember(query) {
      let params = new URLSearchParams();
      params.append("name", query);
      employee(params)
        .then((response) => {
          console.log(response);
          this.memberList = response.data.data;
        })
        .catch((error) => {
          console.log("error!!");
        });
    },
    memberSave() {
      var _this = this;
      _this.memberclicked = true;
      let params = new URLSearchParams();
      params.append("shippingEmployeeId", this.value1);
      params.append("shopId", _this.form.shopId);
      params.append("memo", _this.memberMemo);
      dispatch(this.form.id, params)
        .then((response) => {
          this.$message({
            message: response.content,
            offset: 120,
            center: true,
          });
          _this.memberclicked = false;
          _this.findClick();
          _this.confirmType = false;
        })
        .catch((error) => {
          _this.memberclicked = false;
        });
    },
    isTeach(data) {
      this.isNoInstall = data;
    },
    printClick() {
      print(this.form.id)
        .then((response) => {
          this.$message({
            message: response.content,
            offset: 120,
            center: true,
          });
        });
    },
    handleCommand(command) {
      if (command == "printSetupClick") {
        this.printSetupClick();
      } else {
        this.exportViewClick();
      }
    },
    payRefresh() {
      this.pay = [{
        amount: 0,
        paymentPluginId: "cashPayPlugin",
        paymentPluginName: "实收现金",
        status: 0,
        quantity: 0,
        method: 1,
        attach: "",
        id: "",
      },
        {
          amount: 0,
          paymentPluginId: "paperPayPlugin",
          paymentPluginName: "纸质水票",
          status: 0,
          method: 1,
          quantity: 0,
          attach: "",
          id: "",
        },
        {
          amount: 0,
          paymentPluginId: "debtPayPlugin",
          paymentPluginName: "月结欠款",
          status: 0,
          method: 1,
          quantity: 0,
          attach: "",
          id: "",
        },
      ];
    },
    // 送达
    completeClick() {
      if (this.form.itemList.length > 3) {
        this.allHeight = 200 + "px";
      }
      this.writeoffType = true;
    },
    writeoffClose() {
      this.writeoffType = false;
    },
    toCalculation(val) {
      this.calculateWaitPay()
    },
    returnbackClick() {
      this.bomTile = "添加回桶";
      this.returnbackVisible = true;
      this.loadTongProduct();
    },
    returnClick() {
      this.bomTile = "添加退桶";
      this.bomTileagein = '退桶数量'
      this.bomType = "return";
      this.returnVisible = true;
      this.loadProduct();
      this.loadTongProduct();
    },
    depositClick() {
      this.bomTile = "添加押桶";
      this.bomTileagein = '押桶数量'
      this.bomType = "add";
      this.returnVisible = true;
      this.loadProduct();
      this.loadTongProduct();
    },
    freightchange() {
      if (utils.isNull(this.shippingFreight)) {
        this.shippingFreight = 0
      }
      if (this.shippingFreight < 0) {
        this.shippingFreight = 0
      }
      this.calculateWaitPay()
    },
    writeoffSave() {
      var itemList = [];
      this.form.itemList.forEach((item) => {
        if (item.emptyBarrelQuantity) {
          item.returnQuantity = Number(item.returnQuantity);
          itemList.push(item);
        }
      });
      this.$confirm("确认修改订单?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        var number = 0;
        var isTrue = true;
        var waitePay = 0;
        this.allCount = 0
        this.pay.forEach((item) => {
          this.allCount += Number(item.amount);
          if (item.paymentPluginId == "debtPayPlugin") {
            waitePay = item.amount;
          }
        });
        this.allCount = Number(this.allCount)
        var numberAll = 0;
        this.allWaitPay = Number(this.allWaitPay)
        numberAll = this.allWaitPay + this.historyAmount;
        if (this.pay[1].amount > 0) {
          if (this.pay[1].quantity < 1) {
            this.$message({
              message: "水票张数不可为0",
              type: "warning",
            });
            isTrue = false;
          }
        }
        if (numberAll > 0) {
          if (this.allCount > numberAll) {
            this.$message({
              message: "请勿超出总欠款",
              type: "warning",
            });
            isTrue = false;
          }
        }
        if (this.allWaitPay > 0) {
          if (this.allCount < this.allWaitPay) {
            this.$message({
              message: "本单应收不足",
              type: "warning",
            });
            isTrue = false;
          }

          if (this.allWaitPay)
            if (waitePay > this.allWaitPay) {
              this.$message({
                message: "欠款不能超过本单应收",
                type: "warning",
              });
              isTrue = false;
            }
        }

        var itemlist = [];
        this.form.itemList.forEach((item) => {
          if (!item.virtualType) {
            itemlist.push(item);
          }
        });

        if (isTrue == true) {
          var payment = [];
          var orderId = "";
          if (this.form.orderId != null) {
            orderId = this.form.orderId;
          } else {
            orderId = this.form.warehouseId;
          }
          this.pay.forEach((item) => {
            var paymentList = {
              amount: item.amount,
              createBy: this.form.createBy,
              deleted: this.form.deleted,
              enterpriseId: this.form.enterpriseId,
              memberId: this.form.memberId,
              modifyDate: this.form.modifyDate,
              orderId: orderId,
              orderSn: this.form.orderSn,
              orderType: 0,
              paymentPluginId: item.paymentPluginId,
              paymentPluginName: item.paymentPluginName,
              refund: 0,
              shopId: this.form.shopId,
              status: item.status,
              type: 1,
              way: 1,
              employeeId: this.form.shippingEmployeeId,
              method: item.method,
              memo: "购买-" + this.form.itemList[0].name,
              quantity: item.quantity,
              attach: item.attach,
              id: item.id,
            };
            payment.push(paymentList);
          });
          let params = new URLSearchParams();
          params.append("shippingFreight", this.shippingFreight);
          params.append("levelFreight", this.levelFreight);
          updatePayment(payment, params).then((res) => {
            shipping(this.form.id, itemlist, params).then((response) => {
              this.writeoffType = false;
              this.$message({
                message: response.content,
                offset: 120,
                center: true,
              });
              this.findClick();
            });
          });
        }
      });
    },
    selectreturnBom() {
      var Backbarrelproduct = [];
      this.form.itemList.forEach((item) => {
        Backbarrelproduct.push(item.productId);
      });
      var index = Backbarrelproduct.indexOf(this.obbitem.emptyBarrelId);
      console.log(index);
      if (index != -1) {
        this.form.itemList[index].emptyBarrelQuantity = Number(this.form.itemList[index].emptyBarrelQuantity);
        this.obbitem.returnemptyBarrelQuantity = Number(this.obbitem.returnemptyBarrelQuantity);
        this.form.itemList[index].emptyBarrelQuantity += this.obbitem.returnemptyBarrelQuantity;
        this.returnbackVisible = false;
      } else {
        addShippingItem({
          emptyBarrelQuantity: this.obbitem.returnemptyBarrelQuantity,
          productId: this.obbitem.emptyBarrelId,
          shippingId: this.form.id,
        }).then((res) => {
          this.returnbackVisible = false;
          this.findClick();
        });
      }
    },
    deleteAd(data) {
      var _this = this;
      console.log(data);
      this.$confirm("确认删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        if (data.subType == 4) {
          delShippingItem({
            shippingItemId: data.id,
          }).then((res) => {
            _this.form.itemList.forEach(function(item, index) {
              console.log(item.id);
              console.log(data.id);
              if (item.id == data.id) {
                _this.form.itemList.splice(index, 1);
              }
            });
            this.findClick()
          });

        } else if (data.subType == 3) {
          removeVirtaul({
            virtualProductId: data.id
          }).then(item => {
            _this.form.itemList.forEach(function(item, index) {
              console.log(item.id);
              console.log(data.id);
              if (item.id == data.id) {
                _this.form.itemList.splice(index, 1);
              }
            });
            this.findClick()
          }).catch(item => {


          })

        }
      });
    },
    iffocus(val) {
      this.iffocusnumber = 0;
      this.iffocusnumber = this.form.itemList[val].returnQuantity;
    },
    ifblur(val) {
      this.calculateWaitPay()
    },
    unionClick(){
      var _this = this
      if (!utils.isNull(this.form.shopId)){
        shopFind(this.form.shopId).then(res=>{
          _this.unionType = res.data.shop.type
          console.log(res)
          console.log('店铺')
        })
      }else {
        _this.unionType = 0
      }
    },
  },
};
</script>

<style scoped>
.centralinformation {
  display: flex;
  width: 50%;
  justify-content: space-between;

}

.box-card {
  width: 100%;
  box-sizing: border-box;
}

.details_Header {
  display: flex;
  align-items: center;
}

.deleted_Line {
  width: 2px;
  height: 12px;
  background-color: #409eff;
}

.details_HeaderTitle {
  font-weight: 600;
  margin-left: 5px;
  display: block;
  width: 100px;
}

.deleted_OrderHeader {
  /* padding-top: 20px;
padding-bottom: 15px;
border-bottom: 1px solid #f2f2f2; */
  padding-top: 5px;
  padding-bottom: 10px;
  margin: 10px 0;
  border-left: 1px solid #f2f2f2;
  border-bottom: 1px solid #f2f2f2;
}

.deleted_OrderHeader_payment {
  /*padding-top: 20px;*/
  /*display: flex;*/

  padding-bottom: 15px;
}

/* .deleted_OrderTitle {
} */

.deleted_OrderContent {
  margin-top: 20px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.details_PayHeader {
  display: flex;
  align-items: center;
  margin-top: 40px;
}

.details_Buyers {
  display: flex;
  align-items: center;
}

.deleted_Row_Headings {
  color: #666666;
}

.deleted_OrderName {
  color: #409eff;
  margin-left: 5px;
  width: 250px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product_header {
  width: 60%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  /*border-left: 5px #409EFF solid;*/
  margin-bottom: 10px;
  background-color: #f2f2f2;
  margin-top: 10px;
}

.select_payment {
  /*width: 100%;*/
  display: flex;

  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
}

.product_header_name {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-left: 5px #409eff solid;
  margin-bottom: 20px;
  background-color: #f2f2f2;
  margin-top: 20px;
}

.product_header_nameTwo {
  width: 100%;
  display: flex;
  align-items: center;
  background-color: #f2f2f2;
  margin-top: 20px;
  font-weight: 600;
}

/deep/ .el-form-item {
  margin-bottom: 0px;
}

/deep/ .el-dialog__body {
  padding-top: 0px;
}

.el-dialog-div {
  max-height: 60vh;
  overflow-y: auto;
  overflow-x: hidden;
}

.returnIndex {
  background-color: #fff;
  background-image: none;
  border-radius: 4px;
  border: 1px solid #dcdfe6;
  height: 36px;
  line-height: 36px;
  color: #606266;
  padding: 0px 15px;
  width: 79px;
}

.returnIndex:focus {
  outline: none;
  border-color: #1890ff;
}

.submit_payMethod_Content_DateTwo {
  font-size: 12px;
  font-weight: 400;
  color: rgba(26, 26, 30, 0.3);
  line-height: 36px;
  /* display: block; */
  /* margin-top: 10rpx; */
}
</style>
